<template>
    <div class='dex'>
        <div class='tu'>
            <img src="../assets/登录页图.png" alt="">
            <div class='menu'>
                <h3>医联体平台</h3>
                <div class='menu_bott'>
                    <h4>医生登陆</h4>
                    <div class='menu_box'>
                        <form action="">
                            <input type="text" placeholder="手机号" v-model="user.username">
                            <input type="password" v-model="user.password" placeholder="密码">
                            <button v-on:click="logn(user.username,user.password)" >登陆</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <p></p>
    </div>
</template>

<script>
    export default {
       data:function(){
           return{
           user: {
               grant_type: 'password',
                       username: '',
                       password: '',
                       client_secret: '20170101',
                       client_id: 'DOCTOR',
           },
           rules: {
               username: [
                   { required: true, message: '请输入手机号', trigger: 'blur' },
                   { min: 11, max: 11, message: '手机号必须为11位数字' },
               ],
                       password: [
                   { required: true, message: '请输入密码', trigger: 'blur' },
                   { min: 6, max: 18, message: '长度在 6 到 18 个字符' },
               ],
           },
           loading: false,
           }
       },
       methods:{
           changeCount:function(value){
                if(value!=/^1[3,4,5,7,8]\d{9}$/){
                    console.log('手机号码格式不正确');
                }else{
                    console.log('登陆成功')
                }
           },
           logn:function(a,b){
             var   user= {
                   grant_type: 'password',
                           username: '13813813800',
                           password: '123456',
                           client_secret: '20170101',
                           client_id: 'DOCTOR'
               }
               this.$http.post("http://60.205.149.194:5555/uaa/oauth/token",user,{emulateJSON:true}).then(
                       function (res) {
                           // 处理成功的结果
                           alert("cehnggon"+res);
                       },function (res) {
                           // 处理失败的结果
                           alert(JSON.stringify(res))
                       }
               );
               this.$router.push({ name:"Expert" });
           }
       }
    }

</script>


<style>
    .dex{width:100%;height:100%;background:#6A84D9;}
    .tu{width:1200px;height:100%;background-color:#6A84D9;margin:60px auto;position:relative; }
    .menu{width:300px;height:400px;position:absolute;right:100px;top:50px;}
    .menu h3{color:white;text-align:center;margin-bottom:40px;}
    .menu_bott{width:300px;height:300px;background:#D3E2FF;border-radius:20px;position:relative;}
    .menu_bott h4{color:#7D98DB;position:absolute;top:10px;left:30px;}
    .menu_box {position:absolute;top:40px;}
    .menu_bott input{border:0;width:260px;height:40px;border-radius:5px;border:1px solid #ccc;margin-left:20px;margin-top:20px;outline:none;font-size:16px;}
    .menu_bott button{width:260px;height:40px;background:#6886D4;color:white;border-radius:10px;margin-left:20px;margin-top:50px;outline:none}
</style>